<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%--
  Created by IntelliJ IDEA.
  User: DoveXL
  Date: 2018/6/3
  Time: 20:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta name="_csrf" content="${_csrf.token}"/>
    <meta name="_csrf_header"  content="${_csrf.headerName}"/>
    <title>小龙人后台管理平台</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="${pageContext.request.contextPath}/plugins/bootstrap/css/bootstrap.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/plugins/bootstrap/css/font-awesome.css" rel="stylesheet" />
    <!-- Morris Chart Styles-->
    <link href="${pageContext.request.contextPath}/plugins/morris/morris-0.4.3.min.css" rel="stylesheet" />
    <!-- Custom Styles-->
    <link href="${pageContext.request.contextPath}/plugins/bootstrap/css/custom-styles.css" rel="stylesheet" />
    <!-- Google Fonts-->
    <script src="${pageContext.request.contextPath}/plugins/jquery/jquery-3.2.1.min.js"></script>
    <!-- Bootstrap Js -->
    <script src="${pageContext.request.contextPath}/plugins/bootstrap/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/bootstrap/js/bootstrap-paginator.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/jquery/jquery.metisMenu.js"></script>
    <!-- Morris Chart Js -->
    <script src="${pageContext.request.contextPath}/plugins/morris/raphael-2.1.0.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/morris/morris.js"></script>
    <script src="${pageContext.request.contextPath}/scripts/utility/utility.js"></script>
    <script src="${pageContext.request.contextPath}/scripts/team/TeamInfo.js"></script>

    <!-- Custom Js -->
    <script src="${pageContext.request.contextPath}/plugins/jquery/custom-scripts.js"></script>
</head>
<body>
<nav class="navbar navbar-default top-navbar" role="navigation">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="${pageContext.request.contextPath}/index"><i class="fa fa-gear"></i> <strong>小龙人管理平台</strong></a>
    </div>
    <ul class="nav navbar-top-links navbar-right">
        <label style="font-size: larger;color: white">${UserInfo.user_name}!</label>
        <label style="font-size: larger;color: white">欢迎</label>
        <label style="font-size: larger;color: white">${UserInfo.user_realname}</label>
        <label style="font-size: larger;color: white">管理员登录</label>
        <!-- /.dropdown -->
        <li class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
                <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
            </a>
            <ul class="dropdown-menu dropdown-user">
                <li><a href="#"><i class="fa fa-user fa-fw"></i> User Profile</a>
                </li>
                <li><a href="#"><i class="fa fa-gear fa-fw"></i> Settings</a>
                </li>
                <li class="divider"></li>
                <li><a href="#"><i class="fa fa-sign-out fa-fw"></i> Logout</a>
                </li>
            </ul>
            <!-- /.dropdown-user -->
        </li>
        <!-- /.dropdown -->
    </ul>
</nav>
<!--/. NAV TOP  -->
<nav class="navbar-default navbar-side" role="navigation">
    <div class="sidebar-collapse">
        <ul class="nav" id="main-menu">
            <li>
                <a href="${pageContext.request.contextPath}/index"><i class="fa fa-sitemap" ></i>后台首页<span class="fa arrow"></span></a>
            </li>
            <li>
                <a href="#"><i class="fa fa-sitemap" ></i>小龙人管理<span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li>
                        <a href="${pageContext.request.contextPath}/volunteer/PersonInfo">基本信息</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/volunteer/BankInfo">银行账户</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/volunteer/VolunteerSign">志愿签到</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/volunteer/VolunteerInfo">志愿记录</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/volunteer/HonorInfo">荣誉信息</a>
                    </li>
                </ul>
            </li>
            <li>
                <a href=""><i class="fa fa-sitemap"></i>统计报告<span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li>
                        <a href="${pageContext.request.contextPath}/report/PersonStatistics">基本统计</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/report/TeamStatistics">团队统计</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/report/TimeStatistics">时间统计</a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="#"><i class="fa fa-sitemap" ></i>团队管理<span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li>
                        <a href="${pageContext.request.contextPath}/team/TeamInfo">团队信息</a>
                    </li>
                </ul>
            </li>

            <li>
                <a href="#"><i class="fa fa-sitemap" ></i>系统管理<span class="fa arrow"></span></a>
               <sec:authorize access="hasRole('ROLE_SUPERADMIN')">
                <ul class="nav nav-second-level">
                    <li>
                        <a href="${pageContext.request.contextPath}/system/AdminInfo">用户管理</a>
                    </li>
                    <li>
                        <a href="${pageContext.request.contextPath}/system/DataBackup">数据备份</a>
                    </li>
                </ul>
               </sec:authorize>
            </li>
        </ul>
    </div>
</nav>
<div id="page-wrapper">
    <div id="page-inner">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h1 class="page-header">
                    小龙人管理 <small>团队信息</small>
                </h1>
            </div>
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="background-color: white">
                <div class="tab-pane active" id="TeamInfo"style="margin-left: 2%">
                    <table class="table table-hover">
                        <caption style="align-content: center;font-size: larger;margin-top: 2%">团队信息列表</caption>
                        <thead >
                        <tr style="align-content: center">
                            <th>选择</th>
                            <th>团队姓名</th>
                            <th>团队人数</th>
                            <th>负责人</th>
                            <th>联系电话</th>
                        </tr>
                        </thead>
                        <tbody id="TeamManagementInfo">
                        </tbody>
                    </table>
                    <div id="TeamExample" style="text-align: center"> <ul id="TeampageLimit"></ul> </div>
                    <div class="form-inline" style="margin-top: 2%;margin-bottom: 2%">
                        <button type="button" class="btn btn-info" id="UserDetailInfo" onclick="ShowAddTeamInfoModal()">手动增加</button>
                        <button type="button" class="btn btn-info" id="ModifyDetailInfo" onclick="ShowChangeTeamInfoModal()">修改信息</button>
                        <button type="button" class="btn btn-info" id="DeleteDetailInfo" onclick="ShowDeleteTeamInfoModal()">删除单位</button>
                        <button type="button" class="btn btn-danger" id="ImportVolunteer" onclick="ShowImportTeamInfoModal()">导入增加</button>
                        <button type="button" class="btn btn-danger" id="ExportVolunteer" onclick="ShowExportTeamInfoModal()">导出名单</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="AddTeamInfoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="AddTeamInfoLabel">增加团队信息</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="AddTeamInfoForm">
                    <div class="form-inline">
                        <label class="control-label">单位名称：</label>
                        <input type="text" class="form-control" id = "AddTeamInfoName" placeholder="仅支持输入中文">
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">负&nbsp;&nbsp;责&nbsp;&nbsp;人：</label>
                        <input type="text" class="form-control" id = "AddTeamLeading" placeholder="请输入中文">
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">联系方式：</label>
                        <input type="text" class="form-control" id = "AddTeamLeadingPhonenum" placeholder="请输入11位手机号码">
                    </div>
                </form>
                <label class="control-label" id="AddTeamInfoFlag" style="color: red"></label>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="BtnAddTeamInfo" onclick="AddTeamInfoFunction()">增加</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


<div class="modal fade" id="ChangeTeamInfoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="ChangeTeamInfoLabel">修改单位信息</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="ChangeTeamInfoForm">
                    <div class="form-inline" hidden>
                        <label class="control-label" id = "OriginTeamInfoName"></label>
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">单位名称：</label>
                        <input type="text" class="form-control" id = "NewTeamInfoName" placeholder="请输入中文">
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">负&nbsp;责&nbsp;人&nbsp;：</label>
                        <input type="text" class="form-control" id = "ChangeTeamLeading" placeholder="请输入中文">
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">联系方式：</label>
                        <input type="text" class="form-control" id = "ChangeTeamLeadingPhonenum" placeholder="请输入11位手机号码">
                    </div>
                </form>
                <label class="control-label" id="ChangeTeamInfoFlag" style="color: red"></label>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="BtnChangeTeamInfo" onclick="ChangeTeamInfoFunction()">增加</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


<div class="modal fade" id="DeleteTeamInfoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="DeleteTeamInfoLabel" style="color: red">删除单位信息(删除后会将该单位所有志愿者放入回收站)</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="DeleteTeamInfoForm">
                    <div class="form-inline">
                        <label class="control-label">团队名称：</label>
                        <label class="control-label" id = "DeleteOriginTeamInfoName"></label>
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">负&nbsp;责&nbsp;人&nbsp;：</label>
                        <label  class="control-label"  id = "DeleteTeamLeading"></label>
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">联系方式：</label>
                        <label  class="control-label"  id = "DeleteTeamLeadingPhonenum"></label>
                    </div>
                    <br>
                    <div class="form-inline">
                        <label class="control-label">团队人数：</label>
                        <label  class="control-label"  id = "DeleteTeamNumber"></label>
                    </div>
                </form>
                <label class="control-label" id="DeleteTeamInfoFlag" style="color: red"></label>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-danger" id="BtnDeleteTeamInfo" onclick="DeleteTeamInfoFunction()">确认删除</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<div class="modal fade" id="ImportTeamInfoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="ImportTeamInfoLabel" style="color: red">批量导入单位信息</h4>
            </div>
            <div class="modal-body">
                <a href="${pageContext.request.contextPath}/Downloadfile/teaminfotemplate" class="control-label">点击下载导入模板</a>
                <br>
                <br>
                <div class="form-group" id="passwordDiv">
                    <label>选择用户数据文件</label>
                    <input class="form-control" type="file" id="batchFile" accept=".xls,.xlsx">
                </div>
                <div class="progress progress-striped active" style="display: none">
                    <div id="progressBar" class="progress-bar progress-bar-info"
                         role="progressbar" aria-valuemin="0" aria-valuenow="0"
                         aria-valuemax="100" style="width: 0%">
                    </div>
                </div>
                <div class="form-group">
                    <input id="batchUploadBtn" type="submit" name="submit" class="btn btn-success" value="上传" />
                    <label id="fileName"></label>
                </div>
                <label class="control-label" id="ImportTeamInfoFlag" style="color: red"></label>
                <a class="control-label" id="ErrorTeamInfoExcel" style="color: red;display: none" href="${pageContext.request.contextPath}/Downloadfile/teaminfoErrorExcel">点击下载错误信息</a>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-danger" id="BtnImportTeamInfo" onclick="ImportExcelContent()">确认导入</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<div class="modal fade" id="ExportTeamInfoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="ExportTeamInfoLabel" style="color: red">批量导出单位信息:</h4>
            </div>
            <div class="modal-body">
                <div class="form-inline">
                    <label class="control-label" style="margin-bottom: 2%">请选择要导出的字段</label>
                    <br>
                    <label class="checkbox-inline">
                        <input type="checkbox" name="ExportField"  value="TeamName" checked onchange="DisplayDownload()"> 单位名称
                    </label>
                    <label class="checkbox-inline">
                        <input type="checkbox" name="ExportField"  value="TeamNumber" checked onchange="DisplayDownload()"> 人数
                    </label>
                    <label class="checkbox-inline">
                        <input type="checkbox" name="ExportField"  value="TeamLeading" checked onchange="DisplayDownload()"> 负责人
                    </label>
                    <label class="checkbox-inline">
                        <input type="checkbox" name="ExportField"  value="LeadingPhonenum" checked onchange="DisplayDownload()"> 联系方式
                    </label>
                </div>
                <br>
                <br>
                <div class="form-group">
                    <a class="control-label" id="ExportTeamInfoExcel" style="color: red;display: none" href="${pageContext.request.contextPath}/Downloadfile/teaminfoExportExcel">点击下载</a>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-danger" id="BtnExportTeamInfo" onclick="ExportExcelContent()">确认导出</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>




</body>
</html>
